<template>
  <div class="flex-row">
    <div class="flex" style="width: 300px; margin-right: 15px;">
      <report-items @select-type="showReportType"></report-items>
      <report-history @select-changed="showReport" v-ref:history></report-history>
    </div>
    <!-- 使用动态页签 -->
    <!-- <dynamic :comps='[]' name='report'></dynamic> -->
    <!-- 使用路由切换 -->
    <div style="flex: 1;overflow:scroll" style="padding: 15px;">
      <div class="flex" v-if="$refs.route.cards.length === 0">
        <echarts-box ></echarts-box>
      </div>
      <route v-ref:route @save-success="$refs.history.search" v-show="!($refs.route.cards.length === 0)"></route>
    </div>
  </div>
</template>

<script>
export default {
  title: '报表汇总',
  data () {
    return {
      comp: []
    }
  },
  methods: {
    // 根据选择的数据直接显示保存的报表
    showReport (row) {
      console.log('11111111111111111111111111', row)
      this.$refs.route.init(row.val.f_component_name, {data: row.val})
    },
    // 根据报表的类型选择显示报表
    showReportType (row) {
      this.$refs.route.init(row.f_report_path, {data: row})
    }
  }
}
</script>
